<template>
  <div id="DataMaintenance-gmcOperationlog">
    <div class="flex-all pt10 pb10 pl12 pr12 bg-white height50">
      <div class="ct-head-left flex-al">
        <span class="left-line-orange mr10"></span>
        <span class="color-333 fs14">{{$t('operationLog.operationLog.gmcOperationlog.50zgxdhgpww0')}}</span>
      </div>
    </div>
    <div class="pAll12 bt_EBEEF5">
      <div class="flex-wrap">
        <div class="flex-al mb12">
          <span class="mr10 fs14 color-666">{{$t('operationLog.operationLog.smcOperationlog.50zgxmg33i80')}}</span>
          <div class="select-box" style="width:270px;">
            <el-date-picker
              @change="search"
              v-model="filter.range_time"
              type="daterange"
              value-format="yyyy-MM-dd"
              :range-separator="$t('operationLog.operationLog.gmcOperationlog.50zgxdhgrz00')"
              :start-placeholder="$t('operationLog.operationLog.gmcOperationlog.50zgxdhgscw0')"
              :end-placeholder="$t('operationLog.operationLog.gmcOperationlog.50zgxdhgsps0')"
            ></el-date-picker>
          </div>
        </div>
        <div class="lines ml16 mr16 mb12"></div>
        <div class="flex-al Inquire-box mb12">
          <div class="ipt-box" style="width:280px;">
            <el-input
              v-model="filter.keyword"
              clearable
              :placeholder="$t('operationLog.operationLog.gmcOperationlog.50zgxdhgt480')"
              @clear="search"
              @keyup.enter.native="search"
            ></el-input>
          </div>
          <el-button type="primary" size="mini" class="search-btn fs14" @click="search">{{$t('operationLog.operationLog.gmcOperationlog.50zgxdhgtmo0')}}</el-button>
        </div>
      </div>
      <div class="tableDiv" ref="auto_height_table">
        <settingTableCont :tableData="tableList">
          <!-- 按钮操作组********start -->
          <!-- <el-table-column ref="fixedColumn" label="操作" align="center" width="120px" fixed="right">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click.native.prevent="handSee(scope.row)">{{$t('operationLog.operationLog.gmcOperationlog.50zgxdhgu700')}}</el-button>
            </template>
          </el-table-column>-->
          <!-- 按钮操作组********end -->
        </settingTableCont>
        <!-- 分页 -->
        <el-pagination
          style="margin: 10px;"
          :current-page.sync="paging.curPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size.sync="paging.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="paging.pageTotal"
          @current-change="curPageChange"
          @size-change="pageSizeChange"
        ></el-pagination>
      </div>
    </div>
    <!-- 查看日志 -->
    <popTips
      :dialogVisable="seeItemLog"
      :popTipsCont="popTips_log"
      @handConfirm="seeItemLog=false"
      @handCancel="seeItemLog=false"
      @handleCloseTip="seeItemLog=false"
    ></popTips>
  </div>
</template>

<script>
import settingTableCont from "@/components/tables/settingTableCont.vue";
import popTips from "@/components/common/popTips/popTips.vue";
import setHttp from "../../Set";

export default {
  name: "setting",
  components: {
    settingTableCont,
    popTips
  },
  data() {
    return {
      seeItemLog: false, //查看日志
      //查看日志****弹窗
      popTips_log: {
        btn_text1: this.$t('operationLog.operationLog.gmcOperationlog.50zgxdhguik0'),
        btn_text2: this.$t('operationLog.operationLog.gmcOperationlog.50zgxdhguvk0'),
        title: this.$t('operationLog.operationLog.gmcOperationlog.50zgxdhgu700'),
        context: this.$t('operationLog.operationLog.gmcOperationlog.50zgxdhgv6w0')
      },
      //检索-table
      filter: {
        keyword: "",
        range_time: ""
      },
      // 表格数据
      tableList: {
        // 表格的列
        columns: [],
        // 表格数据
        list: [],
        options: {
          errortip: "", //空页面提示内容
          mutiSelect: false, //是否显示多选
          issetting: false, //是否可以编辑列
          tableHeight: 0
        }
      },
      // 分页
      paging: {
        curPage: 1,
        pageSize: 10,
        pageTotal: 0
      }
    };
  },
  created() {
    this.getComWorkLog();
  },
  methods: {
    //招生相关设置->集团操作日志
    getComWorkLog() {
      setHttp
        .getComWorkLog({
          is_count: "1", //是否需要总数，可以不传
          p: this.paging.curPage,
          num: this.paging.pageSize,
          //筛选条件
          starttime: this.filter.range_time[0] ? this.filter.range_time[0] : "", //开始时间
          endtime: this.filter.range_time[1] ? this.filter.range_time[1] : "", //	结束时间
          keyword: this.filter.keyword
        })
        .then(res => {
          this.paging.pageTotal = parseInt(res.data.result.allnum);
          this.tableList.columns = res.data.result.field;
          console.log(res);
          if (res.data.error == 0) {
            this.tableList.list = res.data.result.list;
          } else {
            this.tableList.list = [];
            this.tableList.options.errortip = res.data.errortip;
          }
        });
    },

    //检索
    search() {
      this.paging.curPage = 1;
      if (this.filter.range_time == null) {
        this.filter.range_time = "";
      }
      this.getComWorkLog();
    },
    //查看日志
    handSee(row) {
      console.log(row);
      this.seeItemLog = !this.seeItemLog;
    },
    // 页码变化
    curPageChange(v) {
      this.paging.curPage = v;
      this.getComWorkLog();
    },
    // pageSize改变
    pageSizeChange() {
      this.paging.curPage = 1;
      this.getComWorkLog();
    },
    //侧边弹窗-关闭
    handleClose(done) {
      done();
    }
  },
  mounted() {
    this.$nextTick(() => {
      if (this.$refs["auto_height_table"]) {
        this.tableList.options.tableHeight = this.$Tool.getTableHeight(
          this.$refs.auto_height_table.getBoundingClientRect().top + 55
        );
      }
    });
  }
};
</script>

<style lang="less">
// #DataMaintenance-gmcOperationlog {
// }
</style>
